import Vue from 'vue'
import App from './App.vue'
//1下载
//2引入
import VueRouter from "vue-router"
//3使用路由插件
Vue.use(VueRouter)
//4创建规则.和引入组件
import Ul_Router from "./components/UI_Router.vue"
import Contacts from "./components/Contavts.vue"
import About from "./components/About.vue"
//  引入二级
import AllCintacts from "./components/views/AllCintacts.vue"
import Alice from "./components/views/Alice.vue"
import Bob from "./components/views/Bob.vue"
// 引入三级
import Blod from "./components/views/child/Blog.vue"
import Fax from "./components/views/child/Fax.vue"
const routes = [
  {
    path: "/",
    redirect: Ul_Router,
  },
  {
    path: "/ulrouter",
    component: Ul_Router,
  },
  {
    path: "/contacts",
    component: Contacts,
    children: [
      {
        path: "allcintacts",
        component: AllCintacts
      },
      {
        path: "alice",
        component: Alice
      },
      {
        path: "bob",
        component: Bob,
        children: [
          {
            path: 'blod',
            component: Blod,
          },
          {
            path: 'fax',
            component: Fax,
          },
        ]
      },
    ]
  },
  {
    path: "/about",
    component: About,
  },
]
//5创建路由
const router = new VueRouter({ routes: routes })
Vue.config.productionTip = false
//6关联vue实例
new Vue({
  router: router,
  render: h => h(App),
}).$mount('#app')
